<!DOCTYPE html>
<html>

	<head>
		<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
	    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
	    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" />
	    <meta name="apple-mobile-web-app-capable" content="yes" />
	    <meta name="apple-mobile-web-app-status-bar-style" content="black" />
	    <meta name="format-detection" content="telephone=no" />
	    <meta http-equiv="Cache-Control" content="must-revalidate,no-cache">
	    <meta http-equiv="x-dns-prefetch-control" content="on" />
	    <meta name="version" content="20170614">
		<title>登录</title>
		<link rel="stylesheet" type="text/css" href="css/reset.css"/>
		<script src="js/initRem.js"></script>
		<link rel="stylesheet" href="css/bootstrap.min.css">  
		<script src="js/jquery-2.1.4.min.js"></script>
		<script src="js/bootstrap.min.js"></script>
		<link rel="stylesheet" type="text/css" href="css/mui.min.css"/>
		<script src="js/mui.min.js" type="text/javascript" charset="utf-8"></script>
		<link rel="stylesheet" type="text/css" href="css/style.css"/>
		<style type="text/css">
			
			
		</style>
	</head>

	<body class="d-login">
		<div class="login">
			<div class="phone">
				<img src="images/ic_Sign_phone@2x.png" class="left-icon"/>
				<!--<i class="left-icon glyphicon glyphicon-earphone"></i>-->
				<input type="text" name="phone" placeholder="请输入手机号" maxlength="11" id="phoneNum"/>
				<i class="right-icon glyphicon glyphicon-menu-down"></i>
			</div>
			<div class="passcode">
				<img src="images/ic_Sign_code@2x.png" class="left-icon"/>
				<img src="images/ic_visibleeye@2x.png" class="right-icon"/>
				<input type="password" id="pass" placeholder="请输入密码" maxlength="20"/>
				<!--<img src="images/ic_visibleeye@2x.png" class="right-icon"/>-->
			</div>
			<div class="sub">
				<button id="btn">
					登录
				</button>
			</div>
			<div class="tips">
				点击登录代表您同意<a href=""><span>软件许可及服务协议</span></a>
			</div>
		</div>
	</body>
	<script type="text/javascript">
		
        var canSee = false;
        $(".passcode .right-icon").click(function(){
        	if(canSee == false){
        		$("#pass").attr("type","text");
        		canSee = true;
        	}else{
        		$("#pass").attr("type","password");
        		canSee = false;
        	}  
        });
        //mui初始化
		mui.init({
			swipeBack: true //启用右滑关闭功能
		});
		$("#btn").click(function(){
		 	if(isEmpty(trim($("#phoneNum").val()))){
		 		mui.alert('请输入手机号', 'Hello MUI');
		 		return;
		 	}else if(!IsTel(trim($("#phoneNum").val()))){
		 		mui.alert('手机号格式不正确', 'Hello MUI');
		 		return;
		 	}else if(isEmpty(trim($("#pass").val()))){
		 		mui.alert('请输入密码', 'Hello MUI');
		 		return;
		 	}else{
		 		
		 	}
		 })
		//验证手机号函数
		function IsTel(Tel){
	        var re=new RegExp(/^(((13[0-9]{1})|(15[0-9]{1})|(17[0-9]{1})|(18[0-9]{1}))+\d{8})$/);
	        var retu=Tel.match(re);
	        if(retu){
	            return true;
	        }else{
	            return false;
	        }
	    };
	    //删除字符串左右两端的空格
	    function trim(str){ //删除左右两端的空格
	　　     return str.replace(/(^\s*)|(\s*$)/g, "");
	　　 };
		//监测是否为空函数
		function isEmpty(str){
			if(trim(str).length == 0){
				return true;
			}
		}
	</script>
</html>